<!DOCTYPE html>
<html>
<head>
<meta content='text/html;charset=utf-8' http-equiv='content-type'>
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
<script type="text/javascript" src="gallery/handlebars/2.0.0/handlebars.js"></script>
<script type="text/javascript" src="jquery/jquery/jquery.js"></script>
<script id="seajsnode" type="text/javascript" src="seajs/seajs/2.2.1/sea.js"></script>
</head>
<style type="text/css">
	*{
		margin: 0px; 
		padding: 0px;
	}
	body{
		padding:10px;
	}
	.planTitle{
		font-size: 25px;
		text-align: center;
		margin:15px auto;
	}
	.introduction{
		margin:15px auto;
	}
	.times{
		margin:15px auto 20px;
	}
</style>
<body>
	<div id="bs-example-navbar-collapse-1"></div>
	<script type="text/x-handlebars-template" id="template">
		<div class='planTitle' >{{planTitle}}<br/></div>
		<p class='introduction'>{{introduction}}<br/></p>
		{{#each item}}
			<h3>{{destination}}</h3>
			<p>{{introduce}}</p>
			<p class="times">{{startDate}}-{{endDate}}{{limitStr}}</p>
		{{/each}}
		<div class='explanation'>{{explanation}}<br/></div>
	</script>
	<script type="text/javascript">
	
		function getQueryString(name){
	        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
	        var r = window.location.search.substr(1).match(reg);  
	        var context = "";
	        if (r != null)
	            context = r[2];
	        reg = null;
	        r = null;
	        return context == null || context == "" || context == "undefined" ? "" : decodeURI(context);
	    }
		
       	seajs.use('moment/moment-2.9.0.js',function(moment){
       		var pkPlan = getQueryString("pkPlan");
       		var print = getQueryString("print");
       		$.ajax({
   				url:"api/plan/query",
   				data:{
   					"pkPlan":pkPlan,
   					fetchProperties:"pkPlan,organization,year,verNumber,planTitle,introduction,explanation,editor,editorDate,publisher,publisherDate,planItem,status,version,"
   		    			+"planItem.pkPlanItem,planItem.destination.*,planItem.startDate,planItem.endDate,planItem.limitmax,planItem.maxpeople,planItem.limitmin,planItem.minpeople,planItem.version"
   				},
   				dataType:"json",
   				success:function(data){
					console.log(data);
   					var planData = data[0];
   					var planitem = planData.planItem;
   					var shuzu = [];
   					for(var i = 0; i < planitem.length; i++){
   						var destin = {};
   						destin.destination = (i+1)+"、"+planitem[i].destination.name;
   						destin.startDate = moment(planitem[i].startDate).format("YYYY年MM月DD日");
   						destin.endDate = moment(planitem[i].endDate).format("YYYY年MM月DD日");
   						
   						var limitStr = ""
   						if(!planitem[i].limitmax && !planitem[i].limitmin){
   							limitStr = "（不限制报名人数）";
   						}else if(!planitem[i].limitmax && planitem[i].limitmin){
   							limitStr = "（每团限制最大人数"+planitem[i].maxpeople+"人）";
   						}else if(planitem[i].limitmax && !planitem[i].limitmin){
   							limitStr = "（每团限制最少人数"+planitem[i].minpeople+"人）";
   						}else if(planitem[i].limitmax && planitem[i].limitmin){
   							limitStr = "（每团限制最大人数"+planitem[i].maxpeople+"人，最少人数"+planitem[i].minpeople+"人）";
   						}
   						destin.limitStr = limitStr;
   						shuzu.push(destin);
   					}
   					planData.planTitle = planData.planTitle;
   					planData.introduction = planData.introduction;
       				
   					planData.item = shuzu;
   					planData.explanation = planData.explanation;
       				
       				var template = $("#template").text();
       				$("#bs-example-navbar-collapse-1").html(Handlebars.compile(template)(planData)); 
       				if(print == "print"){
       					window.print();
       				}
   				}
   			}); 
   		});
        	
    </script>
</body>
</html>